<template>
  <div class="aa">
    <p>aaaa:</p>
    <span>{{ aaa }}</span>
  </div>
</template>

<script setup>
import {reactive,computed} from 'vue'

const author=reactive({
  name: 'John Doe',
  books:[
    '1111',
    '222',
    '333'
  ]
})

const aaa=computed(()=>{
  return author.books.length>0?'yes':'no'
})

</script>

<style lang="scss" scoped>
.aa{
  font-size: 20px;
}
</style>
